<template>
    <div class="home">
        <Header head-title="渣渣辉" go-back="true"></Header>
        <section class="group Result">
            <div id="qrcode" ref="qrcode"></div>
            <img class="LogoJK" src="../../assets/img/logo_.png" alt="">
            <p class="fonts CodeP">800028393484844949</p>
            <p class="fonts CodeP">就诊时出示此二维码</p>
        </section>
                <!-- //只有电子健康卡显示 -->
        <section >
            <div class="GreenBtn">疫情期间就诊，可正常进入医院</div>
            <div class="GreenBtn Yellow">疫情期间就诊，请到分诊台核实信息</div>
            <div class="GreenBtn Red">疫情期间就诊，请直接前往发热门诊</div>
            <div class="GreenBtn Black">疫情期间就诊，请做好个人防护</div>
        </section>
        <section class="group">
            <h2 class="HomeH fontsM resultH">持卡人信息</h2>
            <div class="Select resultInfo">
                <p class="fonts">姓名</p>
                <p class="fonts">渣渣辉</p>
            </div>
            <div class="Select resultInfo">
                <p class="fonts">卡内余额</p>
                <p class="fonts">7.00元</p>
            </div>
            <div class="Select resultInfo">
                <p class="fonts">证件号码</p>
                <p class="fonts">4127********1234</p>
            </div>
            <div class="Select resultInfo">
                <p class="fonts">手机号</p>
                <p class="fonts">18******90</p>
            </div>
            <div class="Select resultInfo">
                <p class="fonts">所属医院</p>
                <p class="fonts">平顶山市第一人民医院</p>
            </div>
            <div class="Select resultInfo">
                <p class="fonts">申请时间</p>
                <p class="fonts">2019-10-12</p>
            </div>
        </section>
        <section class="Select ResultBtn">
            <el-button type="primary">进入微信卡包</el-button>
            <el-button type="primary">开通免密支付</el-button>
            <!-- 本人的电子健康卡不可以解绑，其他人的电子健康卡，所有人的主卡副卡都可以解绑 -->
            <el-button type="primary">解绑该卡</el-button>
        </section>
    </div>
</template>

<script>
import Header from '../../components/Header'
import QRcode from 'qrcodejs2'
export default {
  data () {
    return {
      activeName: 'first',
      activeIndex: '1',
      radio: '1',
      radio1: '1',
      QRtext: 'HHPOIJPUH21974098KJUIHIUJ',
      codes: ''
    }
  },
  components: {
    Header
    // QRcode: QRcode
  },
  mounted () {
    this.$nextTick(() => {
      this.qrcode()
    })
  },
  created () {

  },
  methods: {
    handleClick (tab, event) {
    //   console.log(tab, event)
    },
    Label (index, value) {
      this.label = index
    },
    LabelZ (index, value) {
      this.labelZ = index
    },
    qrcode () {
      this.qrcode = new QRcode('qrcode', {
        width: 200, // 设置宽度，单位像素
        height: 200, // 设置高度，单位像素
        text: 'iuohwgiujreowijreoigwhrekjdnviwroj' // 设置二维码内容或跳转地址
      })
    }
  }
}
</script>

<style scoped>
.home {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    padding-top: 0.8rem;
    overflow-y: auto;
}
#qrcode {
  margin: 0 auto;
  width: 53%;
  /* height: 2rem; */
}
.CodeP:nth-of-type(1){
  margin-top: 0.6rem;
}
.CodeP {
  margin-top: 0.2rem;
}
</style>
